<template>
	<div class="header">
	  <div class="header-left">
	  	<span class="iconfont icon-fanhui"></span>
	  </div>
	  <div class="header-input">输入城市景点游玩主题</div>
    <router-link to="/city">
	  <div class="header-right">
      {{this.headertext}}
	  <span class="iconfont icon-xiangxiajiantoushixin"></span>
		</div>
  </router-link>
  </div>
</template>

<script>
export default {
  name: 'HomeHeader',
  props : ['headertext']
}
</script>

<style lang="stylus" scoped>
@import '~@/assets/styles/varibles/varibles.styl'
.header
  display:flex
  font-size:.28rem
  background:$bgColor
  line-height:.86rem
  color:#fff
  height:.86rem
  .header-left
    width:.64rem
    float:left
    text-align:center
  .header-right
    color:#fff
    width:1.24rem
    float:right
    text-align:center
  .header-input
    flex:1
    background:#fff
    height:.64rem
    padding-left:.15rem
    border-radius:.1rem
    margin-top:.1rem
    line-height:.64rem
    color:#ccc
</style>
